MVC與MVVM

MVC

MVC是一個前後端架構，分為三個部分：

視圖（View），為畫面顯示的地方。

控制器（Controller），控制接收需求並向模型提取資料，做到轉接的功能。

模型（Model），和資料庫對接，收到提取資料要求後向資料庫提取資料。

MVVM

View（視圖）：為畫面顯示的部分，會做畫面渲染的行為，而其他兩個部分都不做渲染的動作。

ViewModel（資料繫結器）：縮寫中的VM部分，和畫面綁定的地方，撰寫程式碼時不會寫到這個部分，資料變動時，會控制視圖部分作出更動，可以說資料與畫面的更新，都需要透過資料繫結器來處理。

Model（資料狀態）：資料處理的地方，一般來說，MVVM架構下，只會處理這個部分。

因此當View當中有一個輸入框（input）時，在Model中有一相對的文字資料，當Model中的文字資料更改時，透過ViewModel，View當中顯示的文字也會變更；相對的，當View當中顯示的文字資料變動時，也會透過ViewModel，將變更後的文字資料傳到Model中作更動。

MVVM與Vue的關係

雖然只要介紹Vue.js時，就會提到MVVM，但兩者其實沒有直接的關係。Vue不是MVVM架構組成的框架，但觀念上的確有受其影響，因此運行時有所借鑒。

傳統方式在控制畫面時，如 jQuery，是操控HTML中的DOM節點，來達成畫面的變動。Vue和傳統方式不一樣的地方在於，Vue是以資料狀態來控制畫面的，就MVVM架構來說，Vue只控制Model的部分，其他部分則是交給Vue當中已經寫好的程式來運行。